<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title></title>
	<link type="text/css" href="css/style.css" rel="stylesheet" />
	<script type="text/javascript" src="js/jquery-1.10.2.js" ></script>
</head>
<body>
	<?php
	if(isset($_POST['ok'])){
		$name=$email=$message="";
		$requied=array('name','email','message');
		$erors=array();
		foreach($requied AS $field_name){
			if(!isset($_POST[$field_name]) || empty($_POST[$field_name])){
				$erors[]= "<p style='color:#f60c0c'>Field <strong>{$field_name}</strong> not blank</p>";
			}
		}
		//lay gia tri nhap vao
		$name1=mysql_real_escape_string($_POST['name']);
		$email1=mysql_real_escape_string($_POST['email']);
		$message1=$_POST['message'];
		$date=date("d-m-Y");

		if($name1 && $email1 && $message1){
			$doc = new DOMDocument ();
			$doc->load ( 'comments.xml' );

			$newNode = $doc->createElement('comment');
			$name = $newNode->appendChild($doc->createElement("name"));
			$name->appendChild($doc->createTextNode($name1));

			$age = $newNode->appendChild($doc->createElement('email'));
			$age->appendChild($doc->createTextNode($email1));

			$salary = $newNode->appendChild($doc->createElement('message'));
			$salary->appendChild($doc->createTextNode($message1));

			$date = $newNode->appendChild($doc->createElement('date'));
			$date->appendChild($doc->createTextNode($date));	
				
			$node = $doc->importNode($newNode, true);
			$doc->documentElement->appendChild($node);

			$doc->save("comments.xml");
		}
	}
	?>
	<div class="comment" >
		<h2>Bình luận</h2>
		<script type="text/javascript"> 
			$(window).load(function(){
					$.ajax({ 
					  type: "POST",//su dung phuong thuc get sub mit lem 
					  url: "comments.xml",//doc trang nhat nghe.xml 
					  dataType: "xml",// khai bao voi trinh duyet dang du lieu la xml 
					  success: function(xml) {//du lieu tra ve do vao bien xml 
						 //xu ly dữ liệu dổ về 
						 //alert("good"); 
						 $(xml).find('comment').each(function(){//tim các element khaigiang trong data xml  
						  var name = $(this).find('name').text();//tim cac element lop trong doi tuong hien hanh 
						  var message = $(this).find('message').text();//tim cac element gia trong doi tuong hien hanh 
						  var date = $(this).find('date').text();
						  var data = "<div class='comment-body'>";
								data +="<div class='comment-author vcard'>";
								data +="<img alt='' src='http://0.gravatar.com/avatar/420e257e082e02cf43e66c4937839f91?s=60&amp;d=&amp;r=G' class='avatar avatar-60 photo' height='60' width='60' />";              
								data +="<strong class='fn'>" + name + "</strong>" ;
								data +="<span class='comment-meta commentmetadata'>" + date + "</span>";
								data +="</div>";
								data +="<div class='comment-content'>";
								data +="<p>" + message  +"</p>";
								data +="</div>";
								data +="<div class='reply'>";
								data +="<a class='comment-reply-link' href='' onclick=''>Reply</a>";        
								data +="</div>";						
							data += "</div>";
						  $(data).appendTo('#wrap'); 
						});  					
					  } 
				}); 
				});
		</script> 
		<div id="wrap">
		</div>
		<h2>Gửi bình luận</h2>
		<?php 
			if(isset($erors) && !empty($erors)){
				foreach($erors as $eror){
					echo "<p>".$eror."</p>";
				}
			}
		?>
		<form action="" method="post">
			<label>Name:</label>
			<input type="text" name="name" size="30" /><br/>
			<label>Email:</label>
			<input type="email" name="email" size="30" /><br/>
			<label>Message:</label>
			<textarea rows="7" cols="60" name="message"></textarea><br/>
			<input id="ok" type="submit" name="ok" value="Send" />
		</form>
	</div>
</body>
</html>